<template>
  <div>
    <van-nav-bar
      :z-index="999"
      :fixed="true"
      left-arrow
      @click-left="onClickLeft"
      :placeholder="true"
    ></van-nav-bar>
    <div class="lt_list">
      <!-- <div @click="href('/TrafficSign')" class="lt_list_item">
        <div class="lt_liatItem">
          <p>交通标志大全</p>
          <div>
            <p></p>
            <img src="../../assets/images/05.png" alt />
          </div>
        </div>
        <div class="lt_images">
          <img src="../../assets/images/huiche.jpg" />
          <img src="../../assets/images/fangxinag.jpg" />
          <img src="../../assets/images/zhixing.jpg" />
          <img src="../../assets/images/tingche.jpg" />
        </div>
      </div> -->

      <div
        v-for="(item, index) in lists"
        :key="index"
        class="lt_list_item"
        @click="href('TrafficTips', item.number)"
      >
        <div class="lt_liatItem">
          <p>{{ item.text }}</p>
          <!-- <p>gfgdfgsd</p> -->
          <div>
            <p></p>
            <!-- <p>fjshdj</p> -->
            <img src="../../assets/images/05.png" alt />
          </div>
        </div>
        <div class="lt_images">
          <img
            v-for="(i, index1) in item.images"
            :key="index1"
            :src="i.image1"
            alt
          />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "subjectOne",
  data() {
    return {
      lists: [
        {
          text: "汽车仪表",
          number: "1",
          images: [
            { image1: require("../../assets/images/ybp(1).jpg") },
            { image1: require("../../assets/images/ybp(1).jpg") },
            { image1: require("../../assets/images/ybp(1).jpg") },
            { image1: require("../../assets/images/ybp(1).jpg") }
          ]
        },
        {
          text: "交警手势",
          number: "5",
          images: [
            {
              image1: require("../../assets/images/jiao.jpg")
            },
            { image1: require("../../assets/images/jiao(2).jpg") },
            { image1: require("../../assets/images/jiao(3).jpg") },
            { image1: require("../../assets/images/jiao(4).jpg") }
          ]
        },
        {
          text: "车内功能按键",
          number: "2",
          images: [
            {
              image1: require("../../assets/images/jian(1).jpg")
            },
            { image1: require("../../assets/images/jian(2).jpg") },
            { image1: require("../../assets/images/jian(3).jpg") },
            { image1: require("../../assets/images/jian(4).jpg") }
          ]
        },
        {
          text: "交通事故责任认定图解",
          number: "3",
          images: [
            {
              image1: require("../../assets/images/sg(1).jpg")
            },
            { image1: require("../../assets/images/sg(2).jpg") },
            { image1: require("../../assets/images/sg(3).jpg") },
            { image1: require("../../assets/images/sg(4).jpg") }
          ]
        },
        {
          text: "色盲测试图集",
          number: "4",
          images: [
            {
              image1: require("../../assets/images/sm(1).jpg")
            },
            { image1: require("../../assets/images/sm(2).jpg") },
            { image1: require("../../assets/images/sm(3).jpg") },
            { image1: require("../../assets/images/sm(4).jpg") }
          ]
        }
      ]
    };
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    href(url, type) {
      this.$router.push({ path: url + "/" + type });
      // if (this.lists[0]) {
      //   this.$router.push({ path: "/TrafficSign" });
      // } else {
      //   this.$router.push({ path: "/TrafficTips" });
      // }
    }
  },
  created() {
    let dsBridge = require("dsbridge");
    dsBridge.call("goBack", "", function() {
      history.go(-1);
    });
  }
};
</script>

<style></style>
